'use strict';

import {
    View,
    TouchableOpacity,
    Navigator,
    ScrollView,
    Image,
    TouchableHighlight,
    StyleSheet,
    NavigatorIOS,
    SwitchIOS,
    AlertIOS,
    PushNotificationIOS,
    Modal,
    LinkingIOS,
    Text
} from 'react-native';
import React  from 'react';
import Icon from 'react-native-vector-icons/Ionicons';
import URL from '../config/server';
import {Utils} from '../config/utils';
import Footer from '../component/Footer';
import DeviceInfo from 'react-native-device-info';
import {Key} from '../config/key';
// import * as httpCache from 'react-native-http-cache';

const NavigationBarRouteMapper = {
    LeftButton(route, navigator, index, navState) {
        return;
    },
    RightButton(route, navigator, index, navState) {
        return null;
    },
    Title(route, navigator, index, navState) {
        return (
            <Text style={styles.title}>
                我的
            </Text>
        );
    }
};

export default class Setting extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            tiePhone: true,
            notifyOpen: false,
            xsdf: true,
            modalVisiable: false,
            permissions: null,
            officalWeb:'http://www.jrztb.net'
        };
    }

    componentWillMount() {
        this._showPermissions();
        this._fetchWebSite();
    }

    componentWillUnmount() {
        clearTimeout(this.setTimer);
    }

    toItem(value) {
        console.log(value);
        this.props.navigator.push({
            id: value
        })
    }

    _fetchWebSite(){
        const WEB_SITE= URL.config+'www';
        let that = this;
        Utils.get1(WEB_SITE, function (data) {
            if(data){
                console.log(data);
                that.setState({
                    officalWeb:data
                })
            }
        })
    }

    _howtoOpen() {
        if (!this.state.notifyOpen) {
            AlertIOS.alert(
                '提示',
                '要开启或关闭神秘涨停网的推送通知,请在iPhone的"设置"-"通知"中找到"神秘涨停网"进行设置'
            )
        }
    }

    _showPermissions() {
        var that = this;
        PushNotificationIOS.checkPermissions((permissions) => {
            console.log(JSON.stringify(permissions));
            for (var x in permissions) {
                if (permissions[x] == 1) {
                    that.setState({
                        notifyOpen: true
                    });
                    break;
                }
            }
        });
        console.log(that.state.notifyOpen);
    }

    triggerModal() {
        this.setState({
            modalVisiable: true
        });
        this.setTimer = setTimeout(()=> {
            this.setState({
                modalVisiable: false
            })
        }, 2000);
    }


    tiePhone(value) {
        this.setState({
            tiePhone: !this.state.tiePhone
        });

        console.log(DeviceInfo.getUniqueID());
        this.triggerModal()
    }
    _getCache() {
        httpCache.clearHttpCache();
        AlertIOS.alert(
            '清除缓存成功!'
        )
    }
    renderScene() {
        return (
            <View style={styles.container}>
                <Modal visible={this.state.modalVisiable} transparent={true}>
                    <View style={styles.modal}>
                        <Text style={{color:"#ffffff"}}>
                            {this.state.tiePhone ? "绑定手机" : "解绑手机"}
                        </Text>
                    </View>
                </Modal>
                <ScrollView style={styles.up}>
                    <TouchableHighlight underlayColor='#e1e1e1' onPress={this.toItem.bind(this,'MyDetail')}>
                        <View style={[styles.Item,{height:60}]}>
                            <Text style={styles.Itemtitle}>
                                个人信息
                            </Text>
                            <Icon name="ios-person" size={30} style={styles.portrait} color="#000000"/>
                        </View>
                    </TouchableHighlight>

                    <Text style={styles.outTitle}>
                        推送设置
                    </Text>
                    <TouchableHighlight underlayColor='#f5f5f9' onPress={()=>{this._howtoOpen()}}>
                        <View style={styles.Item}>
                            <Text style={styles.Itemtitle}>
                                接收推送通知
                            </Text>
                            <Text style={styles.portrait}>{this.state.notifyOpen ? "已开启" : "未开启"}</Text>
                        </View>
                    </TouchableHighlight>

                    {Key.username == "" ? null :
                        <Text style={styles.outTitle}>
                            推广中心
                        </Text>}

                    {Key.username == "" ? null :
                        <TouchableHighlight underlayColor='#e1e1e1' onPress={this.toItem.bind(this,'MySpread')}>
                            <View style={styles.Item}>
                                <Text style={styles.Itemtitle}>
                                    已邀请好友
                                </Text>
                                <Icon name="ios-arrow-forward" size={18} style={styles.portrait} color="#000000"/>
                            </View>
                        </TouchableHighlight>}
                    {Key.username == "" ? null :
                        <TouchableHighlight underlayColor='#e1e1e1' onPress={this.toItem.bind(this,'MyRule')}>
                            <View style={styles.Item}>
                                <Text style={styles.Itemtitle}>
                                    升级规则
                                </Text>
                                <Icon name="ios-arrow-forward" size={18} style={styles.portrait} color="#000000"/>
                            </View>
                        </TouchableHighlight>}
                    <Text style={styles.outTitle}>
                        客户服务
                    </Text>
                    {Key.username == "" ? null :
                        <TouchableHighlight underlayColor='#e1e1e1' onPress={this.toItem.bind(this,'MyOpin')}>
                            <View style={styles.Item}>
                                <Text style={styles.Itemtitle}>
                                    意见反馈
                                </Text>
                                <Icon name="ios-arrow-forward" size={18} style={styles.portrait} color="#000000"/>
                            </View>
                        </TouchableHighlight>}
                    <TouchableHighlight underlayColor='#e1e1e1'
                                        onPress={()=>{LinkingIOS.openURL(this.state.officalWeb)}}>
                        <View style={styles.Item}>
                            <Text style={styles.Itemtitle}>
                                软件官网
                            </Text>
                            <Icon name="ios-arrow-forward" size={18} style={styles.portrait} color="#000000"/>
                        </View>
                    </TouchableHighlight>
                    <TouchableHighlight underlayColor='#e1e1e1' onPress={this.toItem.bind(this,'ConnectUs')}>
                        <View style={styles.Item}>
                            <Text style={styles.Itemtitle}>
                                联系我们
                            </Text>
                            <Icon name="ios-arrow-forward" size={18} style={styles.portrait} color="#000000"/>
                        </View>
                    </TouchableHighlight>
                    <TouchableHighlight underlayColor='#e1e1e1' onPress={this.toItem.bind(this,'MyOut')}>
                        <View style={styles.Item}>
                            <Text style={styles.Itemtitle}>
                                免责声明
                            </Text>
                            <Icon name="ios-arrow-forward" size={18} style={styles.portrait} color="#000000"/>
                        </View>
                    </TouchableHighlight>
                    <Text style={styles.outTitle}>
                        软件信息
                    </Text>
                    <TouchableHighlight underlayColor='#e1e1e1' onPress={()=>console.log(Utils.version)}>
                        <View style={styles.Item}>
                            <Text style={styles.Itemtitle}>
                                当前版本号:{Utils.version}
                            </Text>
                        </View>
                    </TouchableHighlight>
                   {/* <TouchableHighlight underlayColor='#e1e1e1' onPress={()=>{this._getCache()}}>
                        <View style={styles.Item}>
                            <Text style={styles.Itemtitle}>
                                清除缓存
                            </Text>
                        </View>
                    </TouchableHighlight> */}
                </ScrollView>

                <View style={styles.down}>
                    <Footer navigator={this.props.navigator} current={'Setting'}/>
                </View>
            </View>
        );
    }

    render() {
        return (
            <Navigator
                renderScene={this.renderScene.bind(this)}
                navigationBar={
                <Navigator.NavigationBar
                    style={{backgroundColor: '#e02820', alignItems: 'center'}}
                    routeMapper={NavigationBarRouteMapper} />
              }
            />
        );
    }
}
const styles = StyleSheet.create({
    nav: {
        flex: 1
    },
    container: {
        flex: 1,
        marginTop: 64,
        backgroundColor: '#f5f5f9'
    },
    title: {
        color: 'white',
        margin: 10,
        fontSize: 20
    },
    up: {
        flex: 1
    },
    down: {
        height:44,
        backgroundColor: '#000000',
        flexDirection: 'row',
        alignItems: 'center',
        justifyContent: 'center'
    },
    bottomText: {
        flex: 1,
        color: '#ffffff',
        textAlign: 'center',
        fontSize: 16
    },
    outTitle: {
        fontSize: 13,
        textAlign: "left",
        marginTop: 15,
        marginBottom: 4,
        marginLeft: 30
    },
    Item: {
        height: 50,
        backgroundColor: '#ffffff',
        paddingTop: 10,
        paddingBottom: 10,
        flexDirection: 'row',
        borderWidth: 0.5,
        borderColor: '#f5f5f5'
    },
    Itemtitle: {
        paddingLeft: 30,
        flex: 1,
        alignSelf: 'center',
        textAlign: 'left',
        fontSize: 16,
        fontWeight: '600',
    },
    portrait: {
        justifyContent: 'center',
        alignItems: 'center',
        alignSelf: 'center',
        marginRight: 30,
    },
    in: {
        width: 20,
        marginLeft: 10,
        alignSelf: 'center',
        paddingRight: 40,
        textAlign: 'left',
        fontSize: 18,
        color: "#c9c9cd",
        fontWeight: '700',
    },
    switchsheet: {
        marginRight: 20,
    },
    modal: {
        position: 'absolute',
        bottom: 100,
        width:80,
        height:40,
        borderRadius:5,
        justifyContent:'center',
        alignItems:'center',
        left:Utils.size.width/2-40,
        backgroundColor:'#000000'
    }
});

